<template>
	<transition name="el-zoom-in-center">
		<div class="JNPF-preview-main">
			<div class="JNPF-common-page-header">
				<el-page-header @back="goBack" :content="!dataForm.id ? '新建' : isDetail ? '详情' : '编辑'"/>
				<div class="options">
					<el-button type="primary" @click="dataFormSubmit()" v-if="!isDetail">确 定</el-button>
					<el-button @click="goBack">取 消</el-button>
				</div>
			</div>
			<el-row :gutter="15"  class="main" :style="{margin: '0 auto',width:'100%'}">
			<el-form ref="elForm" :model="dataForm" size="medium" label-width="135px" label-position="right" :disabled="!!isDetail" :rules="rules">
				<el-col :span="12">
					<el-form-item label="姓名" prop="name"  >
						<el-input v-model="dataForm.name" placeholder="请输入" clearable :style='{"width":"100%"}' prefix-icon="" suffix-icon="" >
							<template slot="prepend"></template>
							<template slot="append"></template>
						</el-input>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="法人" prop="fr"  >
						<el-input v-model="dataForm.fr" placeholder="请输入" clearable :style='{"width":"100%"}' prefix-icon="" suffix-icon="" >
							<template slot="prepend"></template>
							<template slot="append"></template>
						</el-input>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="类型" prop="lx"  >
						<el-select v-model="dataForm.lx" placeholder="请选择" clearable :style='{"width":"100%"}' >
							<el-option v-for="(item, index) in lxOptions" :key="index" :label="item.fullName" :value="item.id" ></el-option>
						</el-select>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="所属行业" prop="sshy"  >
						<el-select v-model="dataForm.sshy" placeholder="请选择" clearable :style='{"width":"100%"}' >
							<el-option v-for="(item, index) in sshyOptions" :key="index" :label="item.fullName" :value="item.id" ></el-option>
						</el-select>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="统一社会信用代码" prop="tyshxydm"  >
						<el-input v-model="dataForm.tyshxydm" placeholder="请输入" clearable :style='{"width":"100%"}' prefix-icon="" suffix-icon="" >
							<template slot="prepend"></template>
							<template slot="append"></template>
						</el-input>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="纳税人识别号" prop="nsrsbm"  >
						<el-input v-model="dataForm.nsrsbm" placeholder="请输入" clearable :style='{"width":"100%"}' prefix-icon="" suffix-icon="" >
							<template slot="prepend"></template>
							<template slot="append"></template>
						</el-input>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="组织机构代码" prop="zzjgdm"  >
						<el-input v-model="dataForm.zzjgdm" placeholder="请输入" clearable :style='{"width":"100%"}' prefix-icon="" suffix-icon="" >
							<template slot="prepend"></template>
							<template slot="append"></template>
						</el-input>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="登记机关" prop="djjg"  >
						<el-input v-model="dataForm.djjg" placeholder="请输入" clearable :style='{"width":"100%"}' prefix-icon="" suffix-icon="" >
							<template slot="prepend"></template>
							<template slot="append"></template>
						</el-input>
					</el-form-item>
				</el-col>
				<el-col :span="24">
					<el-form-item label="成立日期" prop="clsj"  >
						<el-date-picker v-model="dataForm.clsj" placeholder="请选择" clearable :style='{"width":"100%"}' type="date" format="yyyy-MM-dd" value-format="timestamp" >
						</el-date-picker>
					</el-form-item>
				</el-col>
				<el-col :span="24">
					<el-form-item label="注册地址" prop="zcdz"  >
						<el-input v-model="dataForm.zcdz" placeholder="请输入" show-word-limit :style='{"width":"100%"}' type="textarea" :autosize='{"minRows":4,"maxRows":4}' >
						</el-input>
					</el-form-item>
				</el-col>
				<el-col :span="24">
					<el-form-item label="办公地址" prop="bgdz"  >
						<el-input v-model="dataForm.bgdz" placeholder="请输入" show-word-limit :style='{"width":"100%"}' type="textarea" :autosize='{"minRows":4,"maxRows":4}' >
						</el-input>
					</el-form-item>
				</el-col>
				<el-col :span="24">
					<el-form-item label="承包资质证书" prop="cbzz" >
						<JNPF-UploadFz v-model="cbzzList" accept="" :fileSize="5" sizeUnit="MB" :limit="9" buttonText="点击上传" >
						</JNPF-UploadFz>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="承包资质名称" prop="cbzzmc"  >
						<el-input v-model="dataForm.cbzzmc" placeholder="请输入" clearable :style='{"width":"100%"}' prefix-icon="" suffix-icon="" >
							<template slot="prepend"></template>
							<template slot="append"></template>
						</el-input>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="资质到期时间" prop="zzdqsj"  >
						<el-date-picker v-model="dataForm.zzdqsj" placeholder="请选择" clearable :style='{"width":"100%"}' type="date" format="yyyy-MM-dd" value-format="timestamp" >
						</el-date-picker>
					</el-form-item>
				</el-col>
				<el-col :span="24">
					<el-form-item label="责任书" prop="zrs" >
						<JNPF-UploadFz v-model="zrsList" accept="" :fileSize="5" sizeUnit="MB" :limit="9" buttonText="点击上传" >
						</JNPF-UploadFz>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="责任书名称" prop="zrsmc" >
						<el-input v-model="dataForm.zrsmc" placeholder="请输入" clearable :style='{"width":"100%"}' prefix-icon="" suffix-icon="" >
							<template slot="prepend"></template>
							<template slot="append"></template>
						</el-input>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="责任书到期时间" prop="zrsdqsj" >
						<el-date-picker v-model="dataForm.zrsdqsj" placeholder="请选择" clearable :style='{"width":"100%"}' type="date" format="yyyy-MM-dd" value-format="timestamp" >
						</el-date-picker>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="承包项目名称" prop="cbxmmc" >
						<el-input v-model="dataForm.cbxmmc" placeholder="请输入" clearable :style='{"width":"100%"}' prefix-icon="" suffix-icon="" >
							<template slot="prepend"></template>
							<template slot="append"></template>
						</el-input>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="状态" prop="bz" >
						<el-select v-model="dataForm.bz" placeholder="请选择" clearable :style='{"width":"100%"}' >
							<el-option v-for="(item, index) in ztOptions" :key="index" :label="item.fullName" :value="item.id" ></el-option>
						</el-select>
					</el-form-item>
				</el-col>
			</el-form>
			</el-row>
		</div>
	</transition>

</template>
<script>
import request from '@/utils/request'
import {getDictionaryDataSelector}from '@/api/systemData/dictionary'
import {previewDataInterface}from '@/api/systemData/dataInterface'
export default {
    data() {
      return {
        visible: false,
        isDetail: false,
        dataForm: {
					name:undefined,
					fr:undefined,
					lx:undefined,
					sshy:undefined,
					tyshxydm:undefined,
					nsrsbm:undefined,
					zzjgdm:undefined,
					djjg:undefined,
					clsj:undefined,
					zcdz:undefined,
					bgdz:undefined,
					cbzz:[],
					cbzzmc:undefined,
					zzdqsj:undefined,
					zrs:[],
					zrsmc:undefined,
					zrsdqsj:undefined,
					cbxmmc:undefined,
					bz:undefined,

        },
        rules: {
						name:[
						{
							required:true,
							message:'请输入姓名',
							trigger:'blur'
						},
						],
						// fr:[
						// {
						// 	required:true,
						// 	message:'请输入法人',
						// 	trigger:'blur'
						// },
						// ],
						// lx:[
						// {
						// 	required:true,
						// 	message:'请输入类型',
						// 	trigger:'blur'
						// },
						// ],
						// sshy:[
						// {
						// 	required:true,
						// 	message:'请输入所属行业',
						// 	trigger:'blur'
						// },
						// ],
						// tyshxydm:[
						// {
						// 	required:true,
						// 	message:'请输入统一社会信用代码',
						// 	trigger:'blur'
						// },
						// ],
						// nsrsbm:[
						// {
						// 	required:true,
						// 	message:'请输入纳税人识别号',
						// 	trigger:'blur'
						// },
						// ],
						// zzjgdm:[
						// {
						// 	required:true,
						// 	message:'请输入组织机构代码',
						// 	trigger:'blur'
						// },
						// ],
						// djjg:[
						// {
						// 	required:true,
						// 	message:'请输入登记机关',
						// 	trigger:'blur'
						// },
						// ],
						// clsj:[
						// {
						// 	required:true,
						// 	message:'请输入成立日期',
						// 	trigger:'blur'
						// },
						// ],
						// zcdz:[
						// {
						// 	required:true,
						// 	message:'请输入注册地址',
						// 	trigger:'blur'
						// },
						// ],
						// bgdz:[
						// {
						// 	required:true,
						// 	message:'请输入办公地址',
						// 	trigger:'blur'
						// },
						// ],
						// cbzzmc:[
						// {
						// 	required:true,
						// 	message:'请输入承包资质名称',
						// 	trigger:'blur'
						// },
						// ],
						zzdqsj:[
						{
							required:true,
							message:'请输入资质到期时间',
							trigger:'blur'
						},
						],
						// bz:[
						// {
						// 	required:true,
						// 	message:'请选择状态',
						// 	trigger:'blur'
						// },
						// ],

        },
				ztOptions:[{"fullName":"过期","id":"过期"},{"fullName":"正常","id":"正常"}],
				lxOptions:[{"fullName":"有限责任公司","id":"1"},{"fullName":"股份有限责任公司","id":"2"},{"fullName":"个人独资企业","id":"3"},{"fullName":"合伙企业","id":"4"},{"fullName":"个体工商户","id":"5"}],
				sshyOptions:[{"fullName":"农、林、牧、渔业","id":"1"},{"fullName":"采矿业","id":"2"},{"fullName":"制造业","id":"3"},{"fullName":"电力、热力、燃气及水生产和供应业","id":"4"},{"fullName":"建筑业","id":"5"},{"fullName":"批发和零售业","id":"6"},{"fullName":"交通运输、仓储和邮政业","id":"7"},{"fullName":"住宿和餐饮业","id":"8"},{"fullName":"信息传输、软件和信息技术服务业","id":"9"},{"fullName":"金融业","id":"10"},{"fullName":"房地产业","id":"11"},{"fullName":"租赁和商务服务业","id":"12"},{"fullName":"科学研究和技术服务业","id":"13"},{"fullName":"水利、环境和公共设施管理业","id":"14"},{"fullName":"居民服务、维修和其他服务业","id":"15"},{"fullName":"教育","id":"16"},{"fullName":"卫生和社会工作","id":"17"},{"fullName":"文化、体育和娱乐业","id":"18"},{"fullName":"公共管理、社会保障和社会组织","id":"19"},{"fullName":"国际组织","id":"20"}],

					cbzzList:[],
					zrsList:[],

      }
    },
    created() {

    },
    methods: {

           goBack() {
                    this.$emit('refresh')
                },
      init(id, isDetail) {

        this.dataForm.id = id || 0;
        this.visible = true;
        this.isDetail = isDetail || false;
        this.$nextTick(() => {
          this.$refs['elForm'].resetFields();
          if (this.dataForm.id) {
            request({
              url: '/api/System/wlcbs/' + this.dataForm.id,
              method: 'get'
            }).then(res =>{
              this.dataForm = res.data;
				this.cbzzList = this.dataForm.cbzz ? JSON.parse(this.dataForm.cbzz) : [];
				this.zrsList = this.dataForm.zrs ? JSON.parse(this.dataForm.zrs) : [];

            })
          }
        })
      },
      // 表单提交
      dataFormSubmit() {
				this.$set(this.dataForm, 'cbzz', JSON.stringify(this.cbzzList));
				this.$set(this.dataForm, 'zrs', JSON.stringify(this.zrsList));

        this.$refs['elForm'].validate((valid) => {
          if (valid) {
            if (!this.dataForm.id) {
              request({
                url: '/api/System/wlcbs',
                method: 'post',
                data: this.dataForm,
              }).then((res) =>{
                this.$message({
                  message: res.msg,
                  type: 'success',
                  duration: 1000,
                  onClose: () =>{
                    this.visible = false;
                    this.$emit('refresh', true);
                  }
                })
              })
            } else {
              request({
                url: '/api/System/wlcbs/' + this.dataForm.id,
                method: 'PUT',
                data: this.dataForm
              }).then((res) =>{
                this.$message({
                  message: res.msg,
                  type: 'success',
                  duration: 1000,
                  onClose: () =>{
                    this.visible = false;
                    this.$emit('refresh', true);
                  }
                })
              })
            }
          }
        })
      },

    }
  }
  </script>